<template>
  <div id="course-approve">
		<el-table :data="coursesData" border style="width: 99%;display:block;" size="mini">
			<el-table-column prop="name" label="课程名称" align="center"></el-table-column>
				<el-table-column prop="start_time" label="起始时间" align="center"></el-table-column>
				<el-table-column prop="end_time" label="终止时间" align="center"></el-table-column>
				<el-table-column prop="permission" :formatter="toPermissionLabel" label="状态" align="center"></el-table-column>
				<el-table-column  label="操作" align="center">
					<template slot-scope="scope">
						<el-button round size="mini" type="primary" @click="openApprovalDialog(scope.row)">审核</el-button>
					</template>
				</el-table-column>
		</el-table>

		 <el-dialog title="审核课程" :visible.sync="approvalCourseDialog">
<!--			<el-form size="small" label-width="100px">-->
<!--				<el-form-item label="理由">-->
<!--					<el-input type="textarea" placeholder="请输入原因" v-model="reason" show-word-limit></el-input>-->
<!--				</el-form-item>-->
<!--			</el-form>-->
			 <span slot="footer" class="dialog-footer" >
                <el-button type="primary" @click="approval">通 过</el-button>
                <el-button type="danger" @click="reject">驳 回</el-button>
            </span>
		 </el-dialog>
	</div>
</template>

<script>
export default {
	name: "course-approve",
	data(){
		return{
			coursesData:[],
			approvalCourseDialog:false,
			// reason:'',
			row:[]
		}
	},
	methods:{
		toPermissionLabel(row){
			if(row.permission == 0) return "待审核";
			if(row.permission == 1) return "审核通过";
			if(row.permission == -1) return "审核未通过"
		},
		openApprovalDialog(row){
			if(row.permission != 0) {
				this.$message({type: "error", message: "当前状态的课程不需要审核"});
				return;
			}
			this.approvalCourseDialog = true;
			this.row = row;
		},
		approval(){
			this.postRequest("/course/acceptCourse",{id:this.row.id,permissioin:1}).then(resp=>{
				this.row.permission = 1;
			}).finally(()=>{
				this.approvalCourseDialog = false;
				this.row = {};
				// this.reason = '';
			})
		},
		reject(){
			// if(this.reason == '') {
			// 	this.$message({type: "error", message: "请填写原因"});
			// 	return;
			// }
			this.postRequest("/course/rejectCourse",{id:this.row.id,permission:-1}).then(resp=>{
				this.row.permission = -1;
			}).finally(()=>{
				this.approvalCourseDialog = false;
				this.row = {};
				// this.reason = '';
			})
		}
	},
	mounted(){
		this.postRequest("/course/getPendingApproval",{permission:0}).then(resp=>{
			this.coursesData = resp.data.data.arrays;
		});
	}

}
</script>

<style scoped>

</style>
